<template>
	<view class="border">
		<form action="" method="post">
			<view class="">
				<text class="phone">手机号:</text>
				<input type="text" placeholder="请输入手机号" v-model="form.mobile" class="phoneinp" prop="">
			</view>
			<view class="">
				<text class="mima">密码:</text>
				<input type="password" placeholder="请输入密码" v-model="form.password" class="mimainp">
			</view>
			<view class="fix" @click="fix" style="float: left;">
				修改密码
			</view>
			<view class="registe" @click="registe" style="float: right;">账号注册</view>
			<view class="btn" @click="change" style="margin: o auto;">
				
				<button>登录</button>
			</view>
		</form>
	</view>
</template>

<script>
	// import axios from 'axios'
	import {
		register,
		test
	} from '../../API/login/login.js'

	export default {
		data() {
			return {
				list: {
					gender: 'nj',
					mobile: 123,
					password1: '1234',
					password2: '5678'
				},
				form: {
					mobile: '',
					password: ''
				}
			}
		},
		// mounted:{

		// }
		methods: {
			fix() {
				uni.showToast({
					title:'该功能暂未开放',
					icon:'none'
				})
				// uni.navigateTo({
				// 	url: '../fix/fix'
				// })
			},
			registe() {
				uni.navigateTo({
					url: '../registe/registe'
				})
			},
			change() {
				if (this.form.mobile == '' || this.form.password == '') {
					uni.showToast({
						title: '输入值为空'
					})
				} else {
					// uni.switchTab({
					// 	url: '../index/index'
					// })
					uni.showLoading({
						title: '正在登录...',
						mask: true
					})
					console.log('用了')
					uni.request({
						url: 'http://111.230.59.120:80/kaoping/login/',
						method: 'POST',
						data: this.form,
						success: res => {
							console.log(res)
							if (res.data.code == 200) {
								this.$store.state.user_name = res.data.user_name
								console.log(res.data.user_name)
								uni.showToast({
									title: '登录成功',
									icon: 'success',
									success: (res) => {
										// uni.clearStorage()
										uni.hideLoading()
										uni.redirectTo({
											url: '../month/month'
										})
									}
								})
							}else if(res.statusCode == 500){
									uni.showToast({
										title:'服务器出错',
										icon:'error'
									})
								} else {
								uni.showToast({
									title: '密码错误'
								});
								console.log(res)
							}
						},
						fail: error => {
							console.log(error)
						}
					})
				}
			}
		}
	}
</script>

<style>
	.phone,
	.mima {
		position: absolute;
		left: 30rpx;
	}

	.phoneinp,
	.mimainp {
		margin-left: 150rpx;
		margin-top: 30rpx;
	}

	.btn {
		background-color: skyblue;
		width: 320rpx;
		margin-left: 200rpx;
	}

	.btn button {
		width: 320rpx;
		margin-top: 100rpx;
		background-color: lightskyblue;
	}

	.fix,
	.registe {
		margin-top: 30rpx;
	}

	.border {
		width: 700rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		/* border: 2px solid black; */

	}
</style>